<template>
  <div :class="isActive" @click="itemClick">
    <slot></slot>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
  props: {
    link: {
      type: String,
      required: true
    }
  },
  computed: {
    isActive() {
      return this.$route.path.indexOf(this.link) != -1 ? "active" : "";
    }
  },
  methods: {
    itemClick(){
       this.$router.replace(this.link);
    }
  }
};
</script>

<style lang="scss" scoped>
</style>
